<template>
  <div>
    <div id="arknightsCard">
      <div id="left_card">
        <ArknightsCard_SelectCard></ArknightsCard_SelectCard>
      </div>
    </div>

    <!-- <div
      style="
        height: 100px;
        width: 300px;
        background-color: black;
        display: flex;
        flex-direction: column;
      "
    >
      <div
        style="width: 300px; height: fit-content; color: white; border: 1px solid white; flex: 1"
      >
        Box A
      </div>
      <div
        style="width: 300px; height: fit-content; color: white; border: 1px solid white; flex: 1"
      >
        Box B
      </div>
    </div> -->
  </div>
</template>
<script setup lang="ts">
import ArknightsCard_SelectCard from './components/Arknights_SelectCard.vue'
</script>

<style scoped>
#arknightsCard {
  width: 1150px;
  height: 500px;
  overflow: hidden;
  border: 1px solid #ccc;
}
</style>
